<template>
    <div class="mainBox">
        <PageHeaderNav :need-underline="false" content="用药管理" :need-back="true"></PageHeaderNav>
        <div class="content">
            <MedicineCard v-for="medicine in medicineList"
                          :key="medicine.id"
                          :id="medicine.id"
                          :reminder-item-list="medicine.reminderItemList"
                          :dosage="medicine.dosage"
                          :end-date-time-stamp="medicine.endDateTimeStamp"
                          :start-date-time-stamp="medicine.startDateTimeStamp"
                          :name="medicine.name"
                          :status="medicine.status"
            />
            <van-empty description="暂无用药管理记录" v-if="!this.medicineList.length"></van-empty>
        </div>
    </div>
</template>

<script>
import PageHeaderNav from "@/components/Publlic/PageHeaderNav.vue"
import MedicineCard from "@/components/MedicineClock/MedicineCard.vue";

export default {
    name: "ManageMedicineView",

    components: {
        PageHeaderNav,
        MedicineCard,
    },

    data() {
        return {
            medicineList: []
        }
    },

    created() {
        // 请求药品信息
        this.request.post("/medicineReminder/getMedicineList/", {}).then((response) => {
            const status = response["code"] === 200

            if (status) {
                // 回写数据
                this.medicineList = response["data"]["medicineList"]
            }
        })
    }
}
</script>

<style lang="less" scoped>
.mainBox {
    width: 100%;
    height: 100%;
}

.content {
    width: 100%;
    height: 92%;
    background-color: var(--grayColor);
    overflow-y: scroll;
    padding: 10px 15px;
    box-sizing: border-box;
}
</style>
<style lang="less">
.el-message-box {
    width: 320px !important;
}
</style>